<!-- 首页列表渲染时的占位图 ，等同于loading-->
<template>
<div class="home-skeleton" :style="{height:father}">
    <ul :style="height">
        <!-- 动态绑定style，可以简写width、height; :style="{width,height}" 等同于 :style="{width:width,height:height}" -->
        <li :style="{width,height}" v-for="(item,index) in number" :key="index">
            <!-- :animated="true" 可以简写为 animated -->
            <XtxSkeleton :width="width" :height="height" animated />
        </li>
    </ul>
</div>
</template>

<script>
import XtxSkeleton from '@/components/library/xtx-skeleton';
export default{
    name:'home-skeleton',
    props:['father','width','height','number'],
    components:{XtxSkeleton}
}
</script>

<style lang="less" scoped>
.home-skeleton{
    ul{
        display: flex;
        justify-content: space-between;
    }
}
</style>